function Swiper(el)
{
    this.el=document.querySelector(el)
    this.t=null
    this.num=1
    this.init()

}
Swiper.prototype.init=function()
{
    this.autoChange()
    this.pageChange()
}
Swiper.prototype.autoChange=function()
{
    this.t=setInterval(()=>{
    this.num++
    if (this.num>6) this.num=1
    let imgObjs = this.el.querySelector('img')
    imgObjs.src=`./imgs/imgs/img${this.num}.jpg`
    this.pageChangeAuto()
    },1000)
}
Swiper.prototype.pageChange=function()
{
    let liObjs = this.el.querySelectorAll('ul li')
    liObjs.forEach((item,i) => 
    {
        item.onmouseover=()=>
        {
            clearInterval(this.t)
            this.el.querySelector('img').src=`./imgs/imgs/img${i+1}.jpg`
            this.num=i+1
            this.pageChangeAuto()
        }
        item.onmouseout=()=>
        {
            this.autoChange()
        }
    });
}
Swiper.prototype.pageChangeAuto=function()
{
    this.el.querySelector('ul li.active').className=''
    this.el.querySelectorAll('ul li')[this.num-1].className='active'
}
